<template>
    <div>
        <div class="flight-item">
            <div>
                <el-row @click="handleToOrder()" type="flex" justify="space-between" align="middle" class="flight-info">
                    <el-col :span="4">
                        <span>{{ data.orderNo }}</span>
                    </el-col>
                    <el-col :span="4">
                        <span>{{ data.air.airline_name }} </span> {{ data.air.flight_no }}
                    </el-col>
                    <el-col :span="4">
                        <span>{{ data.air.dep_datetime }}</span>
                    </el-col>
                    <el-col :span="4">
                        <span>{{ data.air.org_city_name }}-{{ data.air.org_airport_name }}-{{ data.air.org_airport_quay }}</span>
                    </el-col>
                    <el-col :span="4">
                        <strong>{{ data.air.org_city_name }}-{{ data.air.dst_city_name }}</strong>
                    </el-col>
                    <el-col :span="2">
                        <strong>{{ data.contactName }}</strong>
                    </el-col>
                    <el-col :span="2">
                        <input type="button" @click="handleToOrder" value="查看"/>
                    </el-col>
                    
                </el-row>
            </div>

        </div>
    </div>
</template>

<script>
export default {
    props: {
        // 数据
        data: {
            type: Object,
            default: () => ({})
        }
    },
    data() {
        return {
            isshow: false,
            orderDetail: [],
        }
    },
    methods:{
        handleToOrder(){
            // 跳转到订单页，航班的id，座位id
            console.log(this.data.id)
            this.$router.push({
                path: "/user/infojipiao",
                query: {
                    id: this.data.id,
                }
            })
        }
    },
}
</script>

<style scoped lang="less">
.flight-item {
    border: 1px #ddd solid;
    margin-bottom: 10px;

    .flight-info {
        padding: 15px;
        cursor: pointer;

        >div {

            &:first-child,
            &:last-child {
                text-align: center;
            }
        }
    }
}
</style>